<!-- 空间输入框 -->
<div class="margin-bottom-10 padding-bottom-10 border-bottom">
    <textarea class="form-control" id="text-content" rows="3"></textarea>
    <div class="margin-top-10">
        <button class="btn btn-primary" id="btn-submit">发表</button> &nbsp;
        <a href="#" id="btn-add-img">
            <i class="fa fa-picture-o"></i> 插入一张图片
        </a>
        <input type="file" accept="image/*" id="file-picture" style="display: none;">
        <input type="hidden" id="input-img-url"> &nbsp;
        <span id="span-img-name"></span>
    </div>
</div>

<script>
    $(function() {
        var $spanImgName = $('#span-img-name')
        var $inputImgUrl = $('#input-img-url')
        var $textContent = $('#text-content')
        var $filePicture = $('#file-picture')

        // 上传图片
        $filePicture.change(function(e) {
            var file = $filePicture[0].files[0]
            $spanImgName.text(file.name)
            ajax.upload('/api/utils/upload', file, function(err, data) {
                if (err) {
                    alert(err)
                    return
                }
                // 成功
                $inputImgUrl.val(data.url)
            })
        })

        // 插入图片
        $('#btn-add-img').click(function(e) {
            e.preventDefault()
                //  开始选择图片
            $filePicture.click()
        })

        // 发布空间
        $('#btn-submit').click(function() {
            var content = $textContent.val().trim()
            var imgUrl = $inputImgUrl.val() || ''

            // 验证
            if (content.length === 0) {
                alert('请输入微博内容')
                return
            }

            // 发布
            ajax.post('/api/blog/create', {
                content: content,
                image: imgUrl
            }, function(err) {
                if (err) {
                    // 失败
                    alert(err)
                    return
                }
                // 成功
                $filePicture.val('')
                $spanImgName.text('')
                $textContent.val('')
                $inputImgUrl.val('')

                // 刷新页面
                location.href = location.pathname
            })
        })

        // @ 功能
        $textContent.atwho({
            at: '@',
            data: '/api/user/getAtList'
                // data: ['Peter', 'Tom', 'Anne']
        })
    })
</script>